<template>
  <div class="container">
    <div class='row'>
      <div class='col-md-6 col-md-offset-3'>
        <form @submit.prevent="formSubmit" class="well  ">
          <div class='row'>
            <div class='col-md-6'>
              <input type="text" class="form-control" v-model="formInput" placeholder="请输入" >
            </div>
            <div class='col-md-4'>
              <select v-model="language" id="exampleSelect1" class='form-control'>
                <option disabled value="">请选择</option>
                <option value="en">English</option>
                <option value="it">Italian</option>
                <option value="ko">Korean</option>
              </select>
            </div>
            <div class='col-md-2'>
              <input type="submit" value="翻译" class="btn center-block">
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>  
</template>

<script>
export default {
  name: 'TranslateForm',
  data(){
    return{
      formInput:'',
      language:''
    }
  },
  methods:{
    formSubmit() {
      // alert(this.formInput)
      this.$emit('formPass',this.formInput,this.language)
    },

  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
